<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>SAPHP - API文档</title>
<include file="public:header">
</head>
<body>
<div id="header">
	<div class="logo">
		<h2> <img src="__ADMINIMAGES__/logo.png" alt="swiftadmin极速开发框架"> SAPHP</h2>
		<span class="title">REST API</span>
	</div>
	<span class="layui-nav-sub layui-small-more" style="display: inline;"></span>
</div>
<div id="content">
	<div class="layui-col-md2">
		<div id="sidebar">
			<div id="apinav"></div>
		</div>
	</div>
	<div class="layui-col-md10">
		<div id="section">
			<div class="apiItem header"></div>
			<volist name="apis" id="vo">
			<php> $vo['id'] = $vo['id'] - 10000; </php>
			<div class="apiItem" id="{$vo.title}">
				<div class="title">{$vo.name}</div>
				<div class="desc">{$vo.content}</div>
				<div class="route">
					<div class="bgfff">
						<div class="method type_{:get_api_method($vo.method)}">{:get_api_method($vo.method)}</div>
					</div>
					<div class="apiurl">{:get_api_url($vo)}</div>
				</div>
				<div class="access" style="display: none;">{$vo.access}</div>
				<div class="params">
					<div class="mintitle">请求参数</div>
					<table class="layui-table">
		            <thead><tr><th>字段</th><th>类型</th><th>默认值</th><th>强制性</th><th>描述</th></tr> </thead>
		            <tbody class="field">
		            <volist name="$vo['params']" id="p">
		              <tr>
		                <td class="n">{$p.name}</td>
		                <td class="t">{$p.type}</td>
		                <td class="d">{$p.default}</td>
		                <td class="m"><eq name="$p.mandatory" value="1"><font color="red">*</font></eq></td>
		                <td class="c">{$p.content}</td>
		              </tr>
		            </volist>
		            </tbody>
		            </table>
				</div>
				<div class="restfuls">
					<div class="mintitle">返回参数</div>
					<table class="layui-table">
		            <thead><tr><th>字段</th><th>类型</th><th>描述</th></tr> </thead>
		            <tbody>
		            <volist name="$vo['restfuls']" id="r">
		              <tr>
		                <td>{$r.name}</td>
		                <td>{$r.type}</td>
		                <td>{$r.content}</td>
		              </tr>
		            </volist>
		            </tbody>
		            </table>
				</div>

				<div class="request">
					<div class="mintitle">Request-Example: <span class="layui-badge-rim APIrun">在线测试</span></div>
					<pre class="response"><code></code></pre>
					<pre class="response_headers"><code></code></pre>
					<pre>
					<code class="language-javascript">{$vo.request}</code>
					</pre>
				</div>
				<div class="restful">
					<div class="mintitle">Success-Response:</div>
					<pre>
					<code class="language-javascript">{$vo.restful}</code>
					</pre>
				</div>
				</div>
			</volist>
		</div>
	</div>
</div>
<include file="public:footer">
</body>
<script type="text/javascript">
	layui.use(['tree'],function(){
		var jquery = layui.jquery;
		var form = layui.form;
		var tree = layui.tree;

        // 创建API分组
		tree.render({
			id: 'apinav'
            ,elem: '#apinav'
            ,data: {$apinav|raw}
			,onlyIconControl: true      
			,click: function(obj){
				var name = obj.data.title;
				var elem = jquery('#'+name);
				if (elem.length >= 1) {
					jquery('html,body').animate({scrollTop: elem.offset().top-50 + 'px'}, 300);
				}
			}
		});

        // 获取侧边栏
        jquery('.layui-small-more').click(function(e) {

        	var side = jquery('#layui-side');
        	if (side.length >= 1) {
        		side.attr('id',null);
        	} else {
        		jquery('body').attr('id','layui-side');
        	}
        })

        jquery('.apiItem').hover(function(e) {
        	if (e.type == 'mouseenter') {
        		jquery(this).find('.APIrun').css('display','inline-block')
        	} else {
        		jquery(this).find('.APIrun').hide();
        	}
        })

        // 测试API接口
        jquery(document).on('click','.APIrun',function(n) {

        	// 测试表单接口
        	jquery('form,.ajax').remove();
        	var that = jquery(this),
        		parents = that.parent().parents('.apiItem'),
        		method = parents.find('.method').text(),
        		action = parents.find('.apiurl').text(),
        		access = parents.find('.access').text(),
        		fields = parents.find('tbody.field tr');
        	var html = '<form class="layui-form" action="'+action+'">';
        	fields.each(function(k,e) {
				var name = jquery(e).find('.n').text(),
					mustbe = jquery(e).find('.m').html(),
					desc = jquery(e).find('.c').text();
				html += '<div class="layui-form-item">';
				html += '<label class="layui-form-label">'+mustbe+desc+'</label>';
				html += '<div class="layui-input-inline">';
				html += '<input name="'+name+'" type="text" class="layui-input"';
				if (mustbe) {
					html += ' lay-verType="tips" lay-verify="required" ';
				}
				html += '>';
				html += '</div></div>';
        	})

        	
        	if (access == 1) {
        		html += '<div class="layui-form-item">';
				html += '<label class="layui-form-label">app_id</label>';
				html += '<div class="layui-input-inline">';
				html += '<input name="app_id" type="text" class="layui-input" lay-verType="tips" lay-verify="required" />';
				html += '</div></div>';
				html += '<div class="layui-form-item">';
				html += '<label class="layui-form-label">app_secret</label>';
				html += '<div class="layui-input-inline">';
				html += '<input name="app_secret" type="text" class="layui-input" lay-verType="tips" lay-verify="required" />';
				html += '</div></div>';
        	} else {
        		html += '<div class="layui-form-item">';
				html += '<label class="layui-form-label">token</label>';
				html += '<div class="layui-input-inline">';
				html += '<input name="token" type="text" class="layui-input" lay-verType="tips" lay-verify="required" />';
				html += '</div></div>';
        	}

        	html += '<div class="layui-form-item">';
        	html += '<div class="layui-input-inline">';
        	html += '';
        	html += '<button class="layui-btn layui-btn-fluid layui-btn-danger" ';
        	html += 'lay-filter="submitPage" lay-submit="">提交</button>';
        	html += '</div></div></form>';

        	if (fields.length >= 1) {
        		that.parent().after(html);

        		// 监听数据提交
				form.on('submit(submitPage)',function(data) {

		        	var type = method == 'GET' ? 'get' : 'post';
		        	data.field.token = 'b83fdc6aa0c0bfe9c34fe34b1590fad0';
					jquery.ajax({
		                url: action,
		                type: type,
		                dataType: 'json',
		                data: data.field, 
		                success: function(data, status, xhr) {
		                 	if (typeof data === 'object') {
	                            var str = JSON.stringify(data, null, 2);
	                            parents.find('.response>code').html(str);
	                        } else {
	                            parents.find('.response>code').html(data);
	                        }
	                        parents.find('.response_headers>code').html('HTTP ' + xhr.status + ' ' + xhr.statusText + '<br/><br/>' + xhr.getAllResponseHeaders());
							parents.find('.response,.response_headers').show();
		                },
		                error: function(data, status, xhr) {
		                    layer.msg('Access methods failure','error');
		                }
		            });
		        	return false;
		        })
        	}
        })

		// 处理高亮函数
        function syntaxHighlight(json) {
            if (typeof json != 'string') {
                json = JSON.stringify(json, undefined, 2);
            }
            json = json.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;');
            return json.replace(/("(\\u[a-zA-Z0-9]{4}|\\[^u]|[^\\"])*"(\s*:)?|\b(true|false|null)\b|-?\d+(?:\.\d*)?(?:[eE][+\-]?\d+)?)/g, function (match) {
                var cls = 'token number';
                if (/^"/.test(match)) {
                    if (/:$/.test(match)) {
                        cls = 'token key';
                    } else {
                        cls = 'token string';
                    }
                } else if (/true|false/.test(match)) {
                    cls = 'token boolean';
                } else if (/null/.test(match)) {
                    cls = 'token null';
                }
                return '<span class="' + cls + '">' + match + '</span>';
            });
        }

	})
</script>
</html>